<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>  
    <link href="../css/mui.min.css" rel="stylesheet"/>
    <script src="../js/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
    <link rel="stylesheet" type="text/css" href="../css/audio.css"/>
    <style type="text/css">
    	.fiexed-buttom{
    		position: fixed;
    		bottom: 30px;
    		left: 15px;
    		right: 15px;
    	}
    </style>
</head>
<body>
	<header class="mui-bar mui-bar-nav">
	    <h1 class="mui-title">录音</h1>
	</header>
	<div class="mui-content">
		<div class="fiexed-buttom">
			<button id="recorder" type="button" class="mui-btn mui-btn-blue mui-btn-block">录制语音文件转base64字符串</button>
			<button id="player" type="button" class="mui-btn mui-btn-blue mui-btn-block">base64字符串转成语音文件播放</button>
		</div>  
	</div>
	
	<div id='sound-alert' class="rprogress">
		<div class="rschedule"></div>
		<div class="r-sigh">!</div>
		<div id="audio-tips" class="rsalert">手指上滑，取消发送</div>
	</div>
	
	<script src="../js/mui.min.js"></script>
	<script type="text/javascript" charset="utf-8">
		mui.init({
			gestureConfig: {
				tap: true, //默认为true
				drag: true, //默认为true
				hold: true, //默认为false，不监听
				release: true //默认为false，不监听
			}
		});
		
		var MIN_SOUND_TIME = 800;
		var AudioBase64;
		var recorder = null;
		var startTimestamp = null;
		var stopTimestamp = null;
		var stopTimer = null;
		var recordCancel = false;
		
		var soundAlert = document.getElementById("sound-alert");
		var audioTips = document.getElementById("audio-tips");
		// 控制录音弹出框是否播放
		var setSoundAlertVisable=function(show){
			if(show){
				soundAlert.style.display = 'block';
				soundAlert.style.opacity = 1;
			}else{
				soundAlert.style.opacity = 0;
				//  完成再真正隐藏
				setTimeout(function(){
					soundAlert.style.display = 'none';
				},200);
			}
		};
		
		mui.plusReady(function () {
			/**
			 * 录制语音文件转base64字符串
			 */
			// 按住录音（长按开始录音）
		    document.querySelector('#recorder').addEventListener('hold',function () {
		    	recordCancel = false;
				if(stopTimer)clearTimeout(stopTimer);
							
				audioTips.innerHTML = "手指上划，取消发送";
				soundAlert.classList.remove('rprogress-sigh');
				setSoundAlertVisable(true);
				
				// 获取当前设备的录音对象
		        recorder = plus.audio.getRecorder();
		        startTimestamp = (new Date()).getTime();
		        
		        console.log("supportedFormats:"+JSON.stringify(recorder.supportedFormats));
		      	recorder.record({
		      		format: "amr",
		      		filename: "_doc/audio/"
		      	}, function (path) {
		      		if (recordCancel) return;
					console.log("path:"+path);
//					playAudio('_doc/audio/1505459496775.amr');
					Audio2dataURL(path);
				}, function ( e ) {
					mui.toast("录音出现异常: " + e.message );
				});
		    })
		    
		    // 释放保存（松手保存）
		    document.querySelector('#recorder').addEventListener('release',function () {
		    	if (audioTips.classList.contains("cancel")) {
					audioTips.classList.remove("cancel");
					audioTips.innerHTML = "手指上划，取消发送";
				}
				// 判断录音时间
				stopTimestamp = (new Date()).getTime();
				if (stopTimestamp - startTimestamp < 800) {
					audioTips.innerHTML = "录音时间太短";
					soundAlert.classList.add('rprogress-sigh');
					recordCancel = true;
					stopTimer=setTimeout(function(){
						setSoundAlertVisable(false);
					},800);
				}else{
					setSoundAlertVisable(false);
				}
				recorder.stop();
		    })
		    
		    // 拖动屏幕（手指上划，取消发送）
			document.body.addEventListener('drag', function(event) {
				if (Math.abs(event.detail.deltaY) > 50) {
					if (!recordCancel) {
						recordCancel = true;
						if (!audioTips.classList.contains("cancel")) {
							audioTips.classList.add("cancel");
						}
						audioTips.innerHTML = "松开手指，取消发送";
					}
				} else {
					if (recordCancel) {
						recordCancel = false;
						if (audioTips.classList.contains("cancel")) {
							audioTips.classList.remove("cancel");
						}
						audioTips.innerHTML = "手指上划，取消发送";
					}
				}
			}, false);
		    
			/**
			 * base64字符串转成语音文件播放
			 */
			$('#player').on('tap',function () {
			    // 语音文件dataURI
//			    var base64Str = 'data:audio/amr;base64,IyFBTVIKPJEXFr5meeHgAeev8AAAAIAAAAAAAAAAAAAAAAAAAAA8SHcklmZ54eAB57rwAAAAwAAAAAAAAAAAAAAAAAAAADxVAIi2Znnh4AHnz/AAAACAAAAAAAAAAAAAAAAAAAAAPEj5H5ZmeeHgAeeK8AAAAMAAAAAAAAAAAAAAAAAAAAA8VP0ftmZ54eAB58/wAAAAgAAAAAAAAAAAAAAAAAAAADxI9R+WZnnh4AHnivAAAADAAAAAAAAAAAAAAAAAAAAAPFT9H7ZmeeHgAefP8AAAAIAAAAAAAAAAAAAAAAAAAAA8SPUflmZ54eAB54rwAAAAwAAAAAAAAAAAAAAAAAAAADxU/R+2Znnh4AHnz/AAAACAAAAAAAAAAAAAAAAAAAAAPEj1H5ZmeeHgAeeK8AAAAMAAAAAAAAAAAAAAAAAAAAA8VP0ftmZ54eAB58/wAAAAgAAAAAAAAAAAAAAAAAAAADxI9R+WZnnh4AHnivAAAADAAAAAAAAAAAAAAAAAAAAAPFT9H7ZmeeHgAefP8AAAAIAAAAAAAAAAAAAAAAAAAAA8SPUflmZ54eAB54rwAAAAwAAAAAAAAAAAAAAAAAAAADxU/R+2Znnh4AHnz/AAAACAAAAAAAAAAAAAAAAAAAAAPEj1H5ZmeeHgAeeK8AAAAMAAAAAAAAAAAAAAAAAAAAA8VP0ftmZ54eAB58/wAAAAgAAAAAAAAAAAAAAAAAAAADxI9R+WZnnh4AHnivAAAADAAAAAAAAAAAAAAAAAAAAAPFT9H7ZmeeHgAefP8AAAAIAAAAAAAAAAAAAAAAAAAAA8SPUflmZ54eAB54rwAAAAwAAAAAAAAAAAAAAAAAAAADxU/R+2Znnh4AHnz/AAAACAAAAAAAAAAAAAAAAAAAAAPEj1H5ZmeeHgAeeK8AAAAMAAAAAAAAAAAAAAAAAAAAA8VP0ftmZ54eAB58/wAAAAgAAAAAAAAAAAAAAAAAAAADxI9R+WZnnh4AHnivAAAADAAAAAAAAAAAAAAAAAAAAAPFT9H7ZmeeHgAefP8AAAAIAAAAAAAAAAAAAAAAAAAAA8BB2uivLR4+iESyvzEzVFQAA1icMaDPgAABEuy3LnMDwoqClGJIiCQUoeGgAtYGeWQy/QoKQEjeMeol5QeJyQPA1/skapKzAhp+fpaGUGNMfj7qumkCV6E9FvLtRXNAA84Cg1TKH6RKDSvKoiHT9NcBSyZKJrW/BYmMgNRuKUUDwIHAyGuniB4NIqyuoBtxXM32n4MhNL3zEcDKciQ65QPBIpm0K1wBoBLVS4JW/Y7TTh0+69sHsBXeKlxIAUTcA84CIEP0wQM4DSiJqQVbZY17nV0HDESCCt1EZMEMzqgDwMKI1U84mkAfFg7IFhFnTY2YtEK1iwZYvEBGHAmiVAPCA8Ehf/tryh4cdnUbSs6GSjTXkO6acXcuQQ4oRMvwA8BrNgXoxjZoHi8esgishdaeMpmPjaq5vfFL33D8tmADzZfhIP7n4sQeIaK0kZWY5sPZYhGUw2S5TWm537ojJQPN45lgYg81Gh8wQFkMFvN2PlnUhO82jyek+oQEzBUjA8NMYUDmY3SwHyf70qcy/cmAw9MoLADKCauGrZH/8CQDxCuhYG4dUQ8kjRDN5yaL/zZDgu2rNb/Bokq66yRrDwPARbwQRpGoFh/p1Nod6R0ahXDewySj3vjJPMbisZ8SA8QkIXAhL4IeH38TykWtg11aQOez4528IHWqwfbxdSgDwauBQDROQJwf7cPHgPTYINEdSFU1DnSWZ6GYdaOvIAPAxKGgaiMIkh/d4NpLk1LINV4Km5hAK5Lw88reKraxA==';
//			    var base64Str = 'data:audio/amr;base64,IyFBTVIKPJEXFr5meeHgAeev8AAAAIAAAAAAAAAAAAAAAAAAAAA8SHcklmZ54eAB57rwAAAAwAAAAAAAAAAAAAAAAAAAADxVAIi2Znnh4AHnz/AAAACAAAAAAAAAAAAAAAAAAAAAPEj5H5ZmeeHgAeeK8AAAAMAAAAAAAAAAAAAAAAAAAAA8CPlmkh3hIXBB58qREQnBLS2AJiaa8Vqa7gILj8G3gDxCdymROQIAABfzq88RwMhLefLr3vK3U6azfvq2nmHAPD72h50rSBEAHi+aAMR3ptW1FgXQIAf3RyrTkKRbVNA8RG5xjrpQA2Af58rpoypM11/kORggGJI0bKkO9aI3wDxEclqNTNoAgFMuupawKhLxonjKARrlXizd3p380vlAPEJoZ0PvUAFgHvfaQQNN2t5xEFKHP1urAHfDDXmGA4A8NHtpjqWEAOBSIPrEkpKP2HysXQprlqRKAXWT10+N0DyQY3GUbFABQB/vCmFBoBTVkGo8slIzg9wwUr/RvD3APAB7ZIjOyA5gH+fKwRKrZcdSOFwEx+Ze8g/wOCfNaAA8CARG6fxy/uA88Dp+Yugn8Wk/5KA9sbyxsvy/jRTRADwCDhY5+GPd4flQK/fVvOVSgXf7AIZEoon9+tA3MEDgPAgFpUn/9LXgzts6yb7dudC4IkGZo1Z5/90vmfbgtHA8Ag+dlgBn8EOE0UpIC35c9H+qChMrd7PFyCTBwv60MDwICD9OAGf64ePJOrcalLDNLS7ovC5JvE9mCWNelXgwPAIHy0yrH59Bj4BaI4qyP8Xt+4Qc4gfGkUBzQtfh3LA8CAhCQf2nxxQbKNpQLF/M/aPIom9Gf4PjhoHm3AlmsDwCBi1B89754PLEa2pTjxBEU2KJgXSHqNxALEnqcoJwPAQJp4nk7pfhyy+6FzAnVe2vj/kYCpudow+hkuBCaqA8BAmiWeAfXyGPLYu3hWWMRjRajOZDkCUUss+2yKJQ8DwCEDSRtU9O4fGHmmsTyCv60riXaHIP/Y0ae9yPV3LwPAgjnRnhh/yJYY0MUtwAMDpA4bxLil8Vor6diMJOFfA8Aj2jWeN28QH/hRTh60wbArI03gJuPTPDoL7SRUmskDzgSh4L5sctw9h1rQYDUMqwQW5eR+FuP9ZUE9iQQC2wPAhBlGnjYG0loy4EncjBPAPZExLaiekfQQ+6sJSh4IA8CFITYeZfZ6H9gbxPQBDr6vWF4k6J0ZOtHyzw2/vgYDwITbJp5kb0tKrRi2EWjYt8KSlbziAzEj+QA6Pv0ZswPARMDmHh++GFutEbMapR4XdZA1i03eV4A3TAoWH/WqA8CEAEYeN3aEPdjDt4rToGRiO0MRy7QkAWWFT0g4DoEDwIRAxh+J3hgc+Ma/1kshlSrWWKFIO1+QyfnfIiWsLQPAgiAmH+rB8B+4Nr5RddjHVBtf0SoHWEQSUCGLRgruA8AlILTgIXLMH7gXoyfRJg21YxPRQw5ig5Kx4Slkb2cDwIO75eDFR4wfDEGwOBYZ50KTm0PJ4LHYs4lPwT1iDwPAI2C0Ndrloh8VBq+t13NvJnBEP+W/HlAXR69mYDRiA8CEW2VgmNA0HwSmtAkCszS0MEkutOvmdBvYI6yKLkgA=='
				var base64Str = AudioBase64;
//				$('#box').text(base64Str)
//				console.log(typeof(base64Str));
//				console.log(entry.toLocalURL())
				// 转成.amr文件播放
				dataURL2Audio(base64Str, function(entry){
					console.log(155+entry.toLocalURL())
					var toURL = entry.toURL();
					console.log(152+toURL);
					// 播放音频
				    playAudio(toURL);
				},function(entry){
					console.log(22222222222)
				}
				)
			})
		})
      	
		/**
		 * 播放音频
		 * @param {Object} path
		 */
		function playAudio (path) {
			var player = plus.audio.createPlayer(path);
			console.log(22265656)
			player.play(function(){
				mui.toast("播放成功");
			}, function(e) {
				mui.toast("播放失败");
			});	
		}
      	
		/**
		 * 录音语音文件转base64字符串
		 * @param {Object} path
		 */
		function Audio2dataURL (path) {
			plus.io.resolveLocalFileSystemURL(path, function(entry){
				entry.file(function(file){
					var reader = new plus.io.FileReader();
					reader.onloadend = function (e) {
						console.log(e.target.result);
						AudioBase64 = e.target.result;
//						dataURL2Audio(AudioBase64, function(entry){
//							console.log(155+entry.toLocalURL())
//							var toURL = entry.toURL();
//							console.log(152+toURL);
//							// 播放音频
//						    playAudio(toURL);
//						},function(entry){
//							console.log(22222222222);
//						}
//						);
					};
					reader.readAsDataURL(file);
				},function(e){
					mui.toast("读写出现异常: " + e.message );
				})
			})
		}
      	
		/**
		 * base64字符串转成语音文件(参考http://ask.dcloud.net.cn/question/16935)
		 * @param {Object} base64Str
		 * @param {Object} callback
		 */
		function dataURL2Audio (base64Str, callback) {
			console.log(230+base64Str)
			var base64Str = base64Str.replace('data:audio/amr;base64,','');
			var audioName = '_doc/audio/'+(new Date()).valueOf() + '.amr';
			console.log(audioName)
			
			plus.io.requestFileSystem(plus.io.PRIVATE_DOC,function(fs){
				fs.root.getFile(audioName,{create:true},function(entry){
					// 获得平台绝对路径
					var fullPath = entry.fullPath;
					if(mui.os.android){  
		    			// 读取音频
			            var Base64 = plus.android.importClass("android.util.Base64");
			            var FileOutputStream = plus.android.importClass("java.io.FileOutputStream");
			            try{
				            var out = new FileOutputStream(fullPath);
			                var bytes = Base64.decode(base64Str, Base64.DEFAULT);
			                out.write(bytes); 
			                out.close();
			                // 回调
			                callback && callback(entry);
		        		}catch(e){
		          			console.log(e.message);
		        		}
		        	}else if(mui.os.ios){
			    		var NSData = plus.ios.importClass('NSData');
						var nsData = new NSData();
						nsData = nsData.initWithBase64EncodedStringoptions(base64Str,0);
						if (nsData) {
						    nsData.plusCallMethod({writeToFile: fullPath,atomically:true});
						    plus.ios.deleteObject(nsData);
						}
						// 回调
			      		callback && callback(entry);
		        	}
				})
			})
		}
    </script>
</body>
</html>